<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>字符串&正则表达式练习</title>
<style type="text/css">
*{padding:0; margin:0;}
body{
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	font-size:12px;
	line-height:30px;
}
.center{
	float:none;
	width: 503px;
	clear:both;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
.inputs {
	border: 1px solid #333;
	width:120px;
	float:left;
}
.left{width:120px;
text-align:right;
padding-right:5px;
}
.red{
	color:#ff0000;
	padding-left:10px;
	font-size:12px;
	}
</style>
<script type="text/javascript">
    // 步骤说明
    // （1）使用表单form的onsubmit事件，根据验证函数的返回值是tru或false来决定是否提示表单。
    // （2）用户名不能为空，长度为4-12个字符，并且用户名只能由字母、数字和下划线组成。
    // （3）密码长度为6-12个字符，两次输入的密码必须一致。
    // （4）必须选择性别。
    // （5）电子邮箱地址不能为空，并且必须包含字符“@”和“.”。
    // （7）出生日期用代码生成，年份范围为1900-当前年份，月份范围为1-12，日范围为1-31。
    // （6）错误提示信息显示在对应表单元素的后面，例如，若用户名不正确时，在文本框后进行提示。

    //在此开始你的代码







    //在此结束你的代码
</script>
</head>

<body>
<div class="center"><img src="images/header1.jpg" /></div>
<div class="center">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <form action="success.html" method="post" name="myform" >
  <tr>
    <td class="left">用户名：</td>
    <td><input id="user" type="text"  class="inputs"/><div id="userId" class="red"></div></td>
  </tr>
   <tr>
    <td class="left">密码：</td>
    <td><input id="pwd" type="password"  class="inputs"/><div id="pwdId" class="red"></div></td>
  <tr>
    <td class="left">确认密码：</td>
    <td><input id="repwd" type="password"  class="inputs"/><div id="repwdId" class="red"></div></td>
  </tr>
  <tr>
   <tr>
    <td class="left">性别：</td>
    <td><div style="float:left;"><input name="sex" type="radio" value="男" />男 <input name="sex" type="radio" value="女" />女</div>
    <div id="sexId" class="red"></div></td>
  </tr>
   <tr>
    <td class="left">电子邮件地址</td>
    <td><input id="email" type="text"  class="inputs"/><div id="emailId" class="red"></div></td>
  </tr>
   <tr>
    <td class="left">出生日期：</td>
    <td><select id="year">
    <script type="text/javascript">
	for(var i=1900;i<=2009;i++){
	document.write("<option value="+i+">"+i+"</option>");	
		}
	</script>
    </select>年
    <select id="month">
    <script type="text/javascript">
	for(var i=1;i<=12;i++){
	document.write("<option value="+i+">"+i+"</option>");	
		}
	</script>
    </select>月
    <select id="day">
    <script type="text/javascript">
	for(var i=1;i<=31;i++){
	document.write("<option value="+i+">"+i+"</option>");	
		}
	</script>
    </select>日</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td><input name="sub" type="submit" value="注册" /> <input name="cancel" type="reset" value="清除" /></td>
  </tr>
  </form>
</table>



</div>
</body>
</html>
